﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>下拉菜单（顶部）</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <link href="../demo.css" rel="stylesheet" type="text/css" />

    <script src="../../scripts/jquery-1.6.2.min.js" type="text/javascript"></script>
    <script src="../../scripts/miniui/miniui.js" type="text/javascript"></script><link href="../../scripts/miniui/themes/default/miniui.css" rel="stylesheet" type="text/css" />
    <link href="../../scripts/miniui/themes/icons.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    html, body
    {
        padding:0;border:0;margin:0;
        width:100%;height:100%;overflow:hidden;
        font-family:Verdana;
        font-size:12px;    
        line-height:22px;
    }
    .header
    {
        background:url(../header.gif) repeat-x 0 -1px;
    }    
    </style>   
</head>
<body>
<div id="layout1" class="mini-layout" style="width:100%;height:100%;">
    <div class="header" region="north" height="70" showSplit="false" showHeader="false"
        bodyStyle="overflow:hidden"
    >        
        <div style="height:40px;line-height:40px;padding-left:15px;font-family:Tahoma;font-size:16px;font-weight:bold;">
            下拉菜单（顶部）
        </div>
        <ul id="menu1" class="mini-menu" vertical="false" style="width:100%;"
            url="../data/listTree.txt" onitemclick="onItemClick" 
            textField="text" idField="id" parentField="pid" resultAsTree="false"
        >
        </ul>
    </div>
    <div title="south" region="south" showSplit="false" showHeader="false" height="30" >
        <div style="line-height:28px;text-align:center;cursor:default">Copyright © 上海普加软件有限公司版权所有 </div>
    </div>
    <div title="center" region="center" bodyStyle="overflow:hidden;">
        <!--Tabs-->
        <div id="mainTabs" class="mini-tabs bg-toolbar" activeIndex="0" style="width:100%;height:100%;"      
            bodyStyle="border:0;background:white;"      
        >        
            <div title="首页" url="../../docs/api/overview.html" >        
            </div>
            <div title="子页面关闭" url="../tabs/pages/page1.html" >        
            </div>
        </div>        
    </div>
</div>  


    <script type="text/javascript">
        mini.parse();

        function showTab(node) {
            var tabs = mini.get("mainTabs");

            var id = "tab$" + node.id;
            var tab = tabs.getTab(id);
            if (!tab) {
                tab = {};
                tab.name = id;
                tab.title = node.text;
                tab.showCloseButton = true;

                //这里拼接了url，实际项目，应该从后台直接获得完整的url地址
                tab.url = mini_JSPath + "../../docs/api/" + node.id + ".html";

                tabs.addTab(tab);
            }
            tabs.activeTab(tab);
        }
        function onItemClick(e) {        
            var item = e.item;
            var isLeaf = e.isLeaf;

            if (isLeaf) {
                showTab(item);
            }            
        }
    </script>

    
</body>
</html>